<template>

  <div class="block">
    <el-calendar v-model="value"></el-calendar>

    <div class="radio">
      排序：
      <el-radio-group v-model="reverse">
        <el-radio :label="false">正序</el-radio>
        <el-radio :label="true">倒序</el-radio>
      </el-radio-group>
    </div>

    <el-timeline :reverse="reverse">
      <el-timeline-item
        v-for="(activity, index) in activities"
        :key="index"
        :timestamp="activity.timestamp">
        {{ activity.content }}
      </el-timeline-item>
    </el-timeline>
  </div>

</template>

<script>
export default {
  name: "CalendarLog",
  data() {
    return {
      //日历的日期
      value: new Date(),
      //时间线的
      reverse: true,
      activities: [{
        content: '上班',
        timestamp: '2024-10-17 08:00:00'
      }, {
        content: '下班',
        timestamp: '2024-10-17 12:01:01'
      }, {
        content: '上班',
        timestamp: '2024-10-17 12:30:01'
      },{
        content: '下班',
        timestamp: '2024-10-17 17:30:01'
      }]
    }
  }
}
</script>

<style scoped>

</style>
